@import "../../../styles/_commonColor.scss";

.calculatorContainer {
  padding: 20px 0 0 0;
  .tips {
    padding: 28px 34px;
    color: #6A6A6A;
    font-size: 30px;
    display: flex;
    align-items: center;
    .tipsMessage {
      flex: 1;
    }
    img {
      width: 36px;
      height: 36px;
      margin-right: 6px;
      display: block;
    }
    & > div {
      color: #ABABAB;
      display: flex;
    }
  }
  .calculatorMessage {
    background: white;
    /*   & > div {
         & > div {
           & > div:nth-child(1) {
             & > div {
               & > div {
                 color: $darkgray !important;
                 font-size: 30px !important;
                 &>div{
                   font-size: 30px !important;
                 }
                 & > div:nth-child(1) {
                   color: $darkgray !important;
                 }
                 & > div:nth-child(2) {
                   color: #1A1A1A !important;
                 }
               }
             }
           }
         }
       }*/
    /*    &>div{
          &>div{
            &>div{
              &>div{
                & > div:nth-child(1) {
                  color: $darkgray !important;
                  font-size: 30px !important;
                }
                & > div:nth-child(2) {
                  color: #1A1A1A !important;
                  font-size: 30px !important;
                }
              }
            }
          }
        }*/

    .registerDateItem, .validityDateItem {
      display: flex;
      font-size: 30px;
      align-items: center;
      img{
        display: block;
        width:36px;
        margin-left: 10px;
        margin-right: 30px;
      }
      span {
        display: block;
        &:nth-child(1) {
          color: $darkgray;
        }
        &:nth-child(3) {
          color: #1A1A1A;
          text-align: right;
          flex: 1;
        }
      }
    }
  }
  .buttonContainer {
    padding: 50px 30px;
    button {
      width: 100%;
      height: 88px;
      background: $blue;
      border: solid 1PX $blue;
      border-radius: 6px;
      color: $white;
      font-size: 34px;
    }
  }

  .calculatorWarnning {
    padding: 50px 30px;
    p {
      color: $gray;
      font-size: 26px;
      padding: 10px 0;
    }
    .warningTitle {
      display: flex;
      align-items: center;
      h1 {
        color: $darkgray;
        font-size: 30px;
        text-align: center;
        padding: 0 20px;
      }
      .titleLine {
        height: 0;
        border-bottom: solid 1PX $lightgray;
        flex: 1;
      }
    }
  }
}
.tipsImage{
  width:630px;
  display:block;
}